<template>
  <el-card shadow="always">
    <h1>{{ id ? '编辑':'创建' }}分类</h1>
    <el-form
      :v-model="form"
      label-width="100px"
    >
      <el-form-item label="分类">
        <el-input
          v-model="form.name"
          style="width:200px"
        />
      </el-form-item>
      <el-form-item>
        <el-button
          type="primary"
          @click="save()"
        >
          保存
        </el-button>
      </el-form-item>
    </el-form>
  </el-card>
</template>

<script>
export default {
    props: {
    id: {}
},
  data() {
    return {
      form: {
        name: '',
        parent: ''
      },
      parents:[]
    };
  },
  created() {
    this.id&&this.fetch()
    // this.getParent()
  },

  methods: {
     async getParent(){
      console.log(this);

          const rs = await this.$http.get('rest/categories')
          this.parents = rs.data
      },
      async fetch(){
          const rs = await this.$http.get(`rest/categories/${this.id}`)
          this.form= rs.data
      },
    async save() {
        let rs
        if(this.id){
           rs= await this.$http.put(`rest/categories/${this.id}`, this.form);
        }
        else{
            
           rs = await this.$http.post("rest/categories", this.form);
           
        }
         if (rs.status !== 200) return;
            this.$message({
              message: "成功",
              type: "success"
            })
            this.$router.push({path: '/categroes/list'})
    }
  }
};
</script>

<style  lang="scss" scoped>

</style>




